<template>
  <div id="card-area">
    <slot v-for="(item, index) in userStore.cardData" :key="index" :item="item"> </slot>
  </div>
</template>
<script setup lang="ts">
import { getCardData } from '@/utils/cardData'
const card = await getCardData()
</script>
<style scoped>
#card-area {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fill, max(200px, 30%));
  grid-auto-rows: auto;
}
</style>
